<template>
	<view class="page">

		<view>
			<view class="title">
				考勤定位
			</view>
			<view class="map">
				<map style="width: 100%; height: 300px;" :latitude="latitude" :longitude="longitude" :markers="covers">
				</map>
			</view>
			<view class="button">
				<button type="default" @click="enterSignUp">进场考勤</button>
				<button style="margin-top: 10px" type="default" @click="outSignUp">出场考勤</button>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				/// 输入框样式
				value: '',
				password: '',
				placeholderStyle: "color:#169BD5;font-size:14px",
				styles: {
					color: '#169BD5',
					borderColor: '#169BD5',
				},
				form: {
					phone: "",
					password: "",
				},



				id: 0, // 使用 marker点击事件 需要填写id
				title: 'map',
				latitude: 39.909,
				longitude: 116.39742,
				covers: [{
					latitude: 39.909,
					longitude: 116.39742,
					iconPath: '../../../static/location.png'
				}],
				userInfo: {
					clockLocation: []
				},
				checkClock:0
			}
		},
		onShow() {
			
		},
		onLoad(option) {
			var that = this
		
			this.getLocationInfo();
			this.userInfo = JSON.parse(option.userInfo)
			console.log(this.userInfo);
			var url = `http://116.205.142.103:8808/labor/system/clock/checkClockRecord?userID=`+this.userInfo.id;
			uni.request({
				url,
				success(res){
					var data = res.data;
					that.checkClock = data.data
					debugger
				}
			})
		},
		// async mounted() {
		// 	await this.getLocationInfo();
		// },
		methods: {
			// 获取当前位置信息
			getLocationInfo() {
				var that = this
				uni.getLocation({
					type: 'wgs84',

					geocode: true,
					success: function(res) {
						console.log('当前位置的：' + JSON.stringify(res));
						console.log('当前位置的经度：' + res.longitude);
						console.log('当前位置的纬度：' + res.latitude);
						
						console.log('当前位置的经度纬度：' + res.longitude + "," + res.latitude);
						console.log('当前位置的经度纬度：' + res.longitude + "," + res.latitude);
						that.covers.forEach(item => {
							item.latitude = res.latitude;
							item.longitude = res.longitude;
						});
						that.latitude = res.latitude;
						that.longitude = res.longitude;
						// let addressObj = res.address
						// that.userInfo.latitude = res.latitude;
						// that.userInfo.longitude = res.longitude;
						// that.userInfo.address = addressObj.province + addressObj.city + addressObj.district + addressObj.street + addressObj.streetNum + addressObj.poiName
					}
				});
			},
			goLocalUp(){
				var that = this;
				const key = "SOEBZ-J2BHS-7YSOI-64K33-6RO65-G2FEJ";
				var url = `https://apis.map.qq.com/ws/geocoder/v1/?location=${that.latitude},${that.longitude}&key=${key}`;
				uni.request({
					url,
					success(res){
						var data = res.data;
						console.log(JSON.stringify(data))
						debugger
						if(data.status != 0){
							// alert(data.message)
							// uni.showToast({title:data.message,icon:"none"})
							return;
						}
						if(that.is === null){
							that.address = "请检查位置信息！";
						}
						if(data.status == 0){
							let address = res.data.result.address + res.data.result.formatted_addresses.recommend
							//that.address = address;
							that.userInfo.address = address;
							console.log('当前位置：' + that.userInfo.address);
							
							uni.navigateTo({
								url: "/pages/signUp/takePhoto/takePhoto?userInfo=" + JSON.stringify(that.userInfo)
							})
						}
					}
				})
			},
			enterSignUp() {
				const ss = this.checkClock
				debugger
				console.log("进场考勤")
				if(this.checkClock < 1){
					this.userInfo.clockType = 1
					this.goLocalUp()	
				}else{
					uni.showModal({
						title: "不能重复进场",
						showCancel: false,
						confirmText: "确定"
					})
				}
			},
			outSignUp() {
				console.log("出场考勤")
				const ss = this.checkClock
				debugger
				if(this.checkClock < 1){
					this.userInfo.clockType = 2
					const key = "SOEBZ-J2BHS-7YSOI-64K33-6RO65-G2FEJ";
					
					this.goLocalUp()
				}else{
					uni.showModal({
						title: "不能重复出场",
						showCancel: false,
						confirmText: "确定"
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		padding: 20rpx;

		.title {
			font-size: 50rpx;
			text-align: center;
			height: 120rpx;
			line-height: 120rpx;
		}

		.button {
			width: 600rpx;
			margin: 120rpx auto 0;
			border-radius: 10rpx;
		}
	}

	uni-button[type=default] {
		background-color: #13BC75 !important;
		color: white;
	}
</style>
